import React from 'react'
import {Text, View, TouchableOpacity, ScrollView} from "react-native";
import Style from "../common/style"
import NativeApi from "../common/NativeApi"
import NavAction from "../common/nativation-action"

import MenuData from "./data"

export default class HomePage extends React.Component {

    state = {
        menus: MenuData,
    };

    render() {
        return (
            <View style={Style.page}>
                <Text style={Style.title}>
                    React Native Learn
                </Text>
                <ScrollView style={{marginTop: 0, paddingLeft: 5, paddingRight: 5}}>
                    <View>
                        {
                            this.state.menus.map((item, index) => this.loadItem(item, index))
                        }
                    </View>
                </ScrollView>

            </View>
        )
    }

    loadItem(item, index) {
        let text = item.name;
        if (item.version) {
            text += " - " + item.version;
        }
        return (
            <TouchableOpacity key={index} style={[Style.button, {marginLeft: 10, marginRight: 10}]}
                              onPress={() => this.itemClick(item)}>
                <Text>{text}</Text>
                <Text>{item.url}</Text>
            </TouchableOpacity>
        )
    }

    itemClick(item) {
        switch (item.action) {
            case NavAction["react-page"]:
                let extras = {
                    a: 1,
                    b: 2,
                    c: 3,
                };
                NativeApi.openReactActivity(JSON.stringify(item), JSON.stringify(extras)).then((data) => {
                    this.setState({
                        result: data
                    })
                }).catch((err) => {
                    this.setState({
                        result: err.code + ":" + err.message
                    })
                });
                break;

            case NavAction["native-page"]:
                NativeApi.openActivity(item.url, "我是通过类名打开的").then((data) => {
                    this.setState({
                        result: data
                    })
                }).catch((err) => {
                    this.setState({
                        result: err.code + ":" + err.message
                    })
                });
                break;

            case NavAction["native-action"]:
                NativeApi.runAction(item.url, "我是通过action打开的").then((data) => {
                    this.setState({
                        result: data
                    })
                }).catch((err) => {
                    this.setState({
                        result: err.code + ":" + err.message
                    })
                });
                break;

            case NavAction.scheme:
                NativeApi.runScheme(item.url, "我是通过scheme名打开的").then((data) => {
                    this.setState({
                        result: data
                    })
                }).catch((err) => {
                    this.setState({
                        result: err.code + ":" + err.message
                    })
                });
                break;

            case NavAction["react-fragment"]:
                let param = {
                    a: 4,
                    b: 5,
                    c: 6,
                };
                NativeApi.openReactFragmentActivity(JSON.stringify(item), JSON.stringify(param)).then((data) => {
                    this.setState({
                        result: data
                    })
                }).catch((err) => {
                    this.setState({
                        result: err.code + ":" + err.message
                    })
                });
                break;
        }
    }

}
